.menu{
  width: 80px;
  height: 100vh;
  background: var(--main-colorBg);
  box-shadow: 0px 0px 10px 0px rgba(77, 124, 254, 0.1);
  border-radius: 0px 12px 12px 0px;
  position: relative;
  z-index: 12;
  backdrop-filter: blur(var(-frosted-glass));
  .logo{
    width: 80px;
    height: 64px;
    background: rgba(255, 255, 255, 0.3);
    box-shadow: 0px 2px 10px 0px rgba(77, 124, 254, 0.1);
    border-radius: 0px 12px 0px 0px;
    backdrop-filter: blur(10px);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .layout-menu{
    margin-top: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    .layout-menu-item{
      width: 56px;
      height: 56px;
      border-radius: 6px;
      font-size: 12px;
      color: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      margin-bottom: 8px;
      .menu-img{
        width: 24px;
        height: 24px;
      }
    }
    .work-tab{
      border-top: 0.5px solid rgba(0, 0, 0, 0.05);
    }
    .layout-menu-item-selected{
      background: var(--main-colorMenuBg);
      color: var(--main-colorMenu);
    }
  }
}
.ant-drawer{
  z-index: 10 !important;
  background: none !important;
}
.ant-drawer-mask{
  background: none !important;
}
.sub-menu-mask{
  background: none !important;
}
.ant-drawer-content{
  background: none !important;
  background-color:  none !important;
}
.ant-drawer-content-wrapper{
  background: rgba(255, 255, 255, 0.4) !important;
  box-shadow: 0px 10px 60px 0px rgba(77, 124, 254, 0.2);
  border-radius: 0px 12px 12px 0px;
  box-sizing: border-box;
  overflow: auto; 
}
